﻿<Views:ViewPage
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    xmlns:Views="clr-namespace:PhoneGuitarTab.Core.Views;assembly=PhoneGuitarTab.Core" 
    xmlns:Controls="clr-namespace:PhoneGuitarTab.UI.Controls" x:Class="PhoneGuitarTab.UI.Views.StaveTabView" 
    xmlns:custom="clr-namespace:PhoneGuitarTab.Controls;assembly=PhoneGuitarTab.Controls"
    xmlns:ui="clr-namespace:Microsoft.Advertising.Mobile.UI;assembly=Microsoft.Advertising.Mobile.UI"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="PortraitOrLandscape" Orientation="Portrait"
    DataContext="{Binding StaveTab, Source={StaticResource Locator}}"
    Style="{StaticResource TransitionPageStyle}"
    shell:SystemTray.IsVisible="True" Loaded="PhoneApplicationPage_Loaded" OrientationChanged="ViewPage_OrientationChanged">


    <!-- ApplicationBar -->
    <custom:Bindable.ApplicationBar>
        <custom:BindableApplicationBar IsVisible="True" IsMenuEnabled="True" Mode="Default" BindableOpacity="0.6">
            <custom:BindableApplicationBarButton x:Name ="InstrumentApplicationBarIconButton" IconUri="/Images/instrument/instruments.png" IsEnabled="True" 
                                            Text="{Binding Path=LocalizedResources.Stave_Instruments, Source={StaticResource LocalizedStrings}}" Command="{Binding ToggleShowInstruments}"/>
            <custom:BindableApplicationBarButton x:Name ="AutoScrollApplicationBarIconButton" IconUri="/Images/light/AutoScroll_Light.png" IsEnabled="True"
                                            Text="{Binding Path=LocalizedResources.Stave_Autoscroll, Source={StaticResource LocalizedStrings}}"  Command="{Binding ToggleSlide}"  CommandParameter="true"/>
            <custom:BindableApplicationBarButton x:Name ="ScaleApplicationBarIconButton"  IconUri="/Images/dark/scale.png" IsEnabled="True" 
                                            Text="{Binding Path=LocalizedResources.Stave_Scale, Source={StaticResource LocalizedStrings}}" Command="{Binding Scale}"/>
            <custom:BindableApplicationBar.MenuItems>
                <custom:BindableApplicationBarMenuItem x:Name="PinToStartMenuButton" IsEnabled="True" 
                                              Text="{Binding Path=LocalizedResources.Stave_Pin, Source={StaticResource LocalizedStrings}}" Command="{Binding PinToStart}"/>
                <custom:BindableApplicationBarMenuItem x:Name="LightMode" IsEnabled="True" 
                                              Text="{Binding Path=LocalizedResources.Shared_LightMode, Source={StaticResource LocalizedStrings}}" Command="{Binding ToggleLightMode}" />
            </custom:BindableApplicationBar.MenuItems>
            </custom:BindableApplicationBar>
    </custom:Bindable.ApplicationBar>
    <Grid>
       
        <!--LayoutRoot is the root grid where all page content is placed-->
        <Grid x:Name="LayoutRoot" Background="Transparent" >
            <Grid.RowDefinitions>
                <RowDefinition Height="175*"/>
                <RowDefinition Height="454*"/>
                <RowDefinition Height="139*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="9*"/>
                <ColumnDefinition Width="563*"/>
                <ColumnDefinition Width="14*"/>
                <ColumnDefinition Width="142*"/>
            </Grid.ColumnDefinitions>

            <phone:WebBrowser x:Name="Browser" 
			IsScriptEnabled="True"
			HorizontalAlignment="Stretch"
			VerticalAlignment="Stretch"
			Loaded="Browser_Loaded"
            LoadCompleted="Browser_LoadCompleted"
            MouseLeftButtonUp="Browser_MouseLeftButtonUp"
			ScriptNotify="Browser_ScriptNotify"
			NavigationFailed="Browser_NavigationFailed" Grid.ColumnSpan="4" Grid.RowSpan="3" RenderTransformOrigin="0.504,0.578"/>
            <Controls:AutoScroll x:Name="slider" 
                             HorizontalAlignment="Left" 
                             Margin="19,105,0,0" 
                             VerticalAlignment="Top" 
                             Height="176" 
                             Width="60" Grid.Column="3" Grid.RowSpan="2" Visibility="Collapsed"/>
            <toolkit:ListPicker x:Name="ListPickerInstrument" FullModeHeader="{Binding Path=LocalizedResources.Stave_SelectInstrument, Source={StaticResource LocalizedStrings}}"
                            Margin="4,104,5,20"
                            ExpansionMode ="FullScreenOnly"
                            Visibility="Collapsed" Opacity="0.5"
                            ItemsSource="{Binding}" RenderTransformOrigin="0.5,0.5" Grid.Column="1" Grid.RowSpan="2" 
                            Background="{StaticResource PhoneBackgroundBrush}" 
                            HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" >

                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding InstrumentName}" />
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>

                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding InstrumentName}" Margin="16 0 0 0" FontSize="{StaticResource PhoneFontSizeExtraLarge}" FontFamily="{StaticResource PhoneFontFamilyNormal}"/>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>

        </Grid>
        <Grid Name="AdContainer">
            <ui:AdControl x:Name="AdControl" ApplicationId="398538e9-3217-46b2-90d2-58bd4208d95f" AdUnitId="10867701" HorizontalAlignment="Center" Height="80" VerticalAlignment="Bottom" Width="480" Visibility="{Binding IsAdEnabled, Converter={StaticResource boolVisibility}}" Margin="0,0,0,72"  />
        </Grid>
    </Grid>
   

</Views:ViewPage>